<!doctype html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
  <head>
      <script th:src="@{/webjars/jquery/3.5.1/jquery.js}">

      </script>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
    <meta name="generator" content="Jekyll v4.0.1">
    <title>Dashboard</title>

    <link rel="canonical" href="https://getbootstrap.com/docs/4.5/examples/dashboard/">

    <!-- Bootstrap core CSS -->
<link th:href="@{/webjars/bootstrap/4.5.0/css/bootstrap.css}" rel="stylesheet">

    <style>
      .bd-placeholder-img {
        font-size: 1.125rem;
        text-anchor: middle;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
      }

      @media (min-width: 768px) {
        .bd-placeholder-img-lg {
          font-size: 3.5rem;
        }
      }
    </style>
      <script th:src="@{/webjars/jquery/3.5.1/jquery.js}"></script>
    <!-- Custom styles for this template -->
    <link th:href="@{/tcr/dashboard.css}" rel="stylesheet">

  </head>
  <body>
  <div th:replace="common/bar::topbar"></div>
<script th:inline="javascript" type="text/javascript">
    var time = new Date()
    var day = ('0' + time.getDate()).slice(-2)
    var month = ('0' + (time.getMonth() + 1)).slice(-2)
    var today = time.getFullYear() + '-' + month + '-' + day
    function delTimeFunc(i) {
        var i = $(i)
        i.parent().parent().remove();
        return false;
    }
    function getStu(obj) {
        var url1 = $(obj).attr("Myid")
        jQuery.ajax({
            type: "get",
            url: url1,
            success: function (data) {

                $("#myTbody").append('<tr> '+
                    '                    <td>\n' +
                                            data.student.id +
                    '                    </td>\n' +
                    '                    <td>\n' +
                                           data.student.name +
                    '                    </td>\n' +
                    '                    <td>\n' +
                                           data.student.sex +
                    '                    </td>\n' +
                    '                    <td>\n' +
                                            data.student.phone +
                    '                    </td>\n' +
                    '                    <td>\n' +
                                           data.student.enterDate +
                    '                    </td>\n' +
                    '                    <td>\n' +
                    '                        <a class="btn btn-sm btn-primary" href="/tcr/student/'+data.student.id+'">编辑</a>\n' +
                    '                    </td>\n' +
                    '                </tr>');
                $("#showMsg").text(data.msg)
            },
            error: function () {
                alert("请重试")
            }
        })
        return false;
    }
    function addTimeFunc() {
        var dt = $("#defaultTime").val();
        var tr = $('<tr>\n' +
            '                      <td>\n' +
            '                        <input type="time" name="time" value="08:00">\n' +
            '                      </td>\n' +
            '                      <td>\n' +
            '                          <input type="text" name="length" value='+dt+'>\n' +
            '                      </td>\n' +
            '                      <td>\n' +
            '                          <button class="btn btn-sm btn-danger delTime" type="button" onclick="delTimeFunc(this)">删除</button>\n' +
            '                      </td>\n' +
            '                  </tr>');
        $("#table1").append(tr);
        return false;
    }
    $(

        function () {
            $.ajax({
                url: "/tcr/teacher",
                type: "get",
                success: function (teacher) {
                    $("#course").append(' <option selected value="'+teacher.course+'" >\n' +teacher.course+

                        '        </option>');
                }
            })
        }
    )

</script>
<div class="container-fluid">
  <div class="row">
   <div th:replace="common/bar::sidebar(activeUri='exam')"></div>

    <main role="main" class="col-md-9 ml-sm-auto col-lg-10 px-md-4">
      <div class="table-responsive">
          <div>
              <br>
              <p class="text-success" th:text="${msg}" th:if="${msg!=null}"></p>
              <form th:method="post" th:action="@{/tcr/exam}">
                  <input name="_method" th:value="post" type="hidden">
              <table class="table table-striped table-sm" id="table1" >
                  <tr>
                      <td>
                          日期<input type="date" name="date" id="defaultDate">
                      </td>
                      <td>
                          考试人数<input type="number" min="1" max="10000" name="num" th:value="1">
                      </td>
                      <td>
                          科目
                          <select name="course" id="course">

                            </select>
                      </td>
                  </tr>
              </table>
                  <button class="btn btn-sm btn-info" href="#" type="submit">发布考试预约</button>
              </form>
              <br>
          </div>




          <br>
          <hr>
          <br>
          <form id="exeSelectForm" th:action="@{/tcr/exam/query}" method="post">
              <input type="date" name="date" >
            <button class="btn btn-sm btn-success" type="submit" id = "exeSelectBtn">查看考试预约</button>
              <script>
                  // $("#exeSelectBtn").click(function(){
                  //     var act = $("#exeSelectForm").attr("action");
                  //     alert(act)
                  //     act += "/"+$("#exeSelectForm+input[name=date]").val();
                  //     alert(act)
                  //     $("#exeSelectForm").attr("action",act);
                  //     // $("#exeSelectForm").submit();
                  // })
              </script>
          </form>
      </div>
        <script>

        </script>
        <div class="table-responsive">
            <p id="showMsg"></p>
            <table class="table table-striped table-sm">
                <thead>
                <tr>
                    <th>ID</th>
                    <th>Name</th>
                    <th>Sex</th>
                    <th>Phone</th>
                    <th>EnterDate</th>
                    <th>操作</th>
                </tr>
                </thead>
                <tbody id ="myTbody">
                </tbody>
            </table>
        </div>

        <div class="table-responsive">

            <table class="table table-striped table-sm">
                <thead>
                <tr>
                    <th>ID</th>
                    <th>Teacher</th>
                    <th>Student</th>
                    <th>ExamDate</th>
                    <th>Score</th>
                    <th>Course</th>
                    <th>操作</th>
                </tr>
                </thead>
                <tbody>
                <tr th:each="exeItem,st:${exams}">
                    <td th:text="${st.count}"></td>
                    <td th:text="${exeItem.getTeacher().getName()}"></td>
                    <td><a class="MyidBtn"
                                th:text="${exeItem.getStudent().getName()}"
                                th:attr="Myid=@{/tcr/exeStudent/}+${exeItem.getSid()}"
                           th:if="${exeItem.student!=null}"
                           href="#"
                    th:onclick="|getStu(this)|"></a></td>

                    <td th:text="${exeItem.getExaminationDate()}"></td>
                    <td th:text="${exeItem.getScore()}"></td>
                    <td th:text="${exeItem.getCourse()}"></td>
                    <td>
                        <div class="btn-group">
                            <a class="btn btn-sm btn-primary" th:href="@{/tcr/exam/}+${exeItem.getId()}">编辑</a>
                            <!--<button type="submit" class="btn btn-sm btn-danger"><span style="color: white">删除</span></button>-->
                            <button href="#" th:attr="del_uri=@{/tcr/exam/}+${exeItem.id}" class="btn btn-sm btn-danger delBtn"><span style="color: white">删除</span></button>
                        </div>
                    </td>
                </tr>
                </tbody>
            </table>
        </div>
      <form id="delForm" method="post" action="#">
        <input type="hidden" name="_method" value="delete"/>
      </form>
        <form id="stuForm" method="get" action="#">

        </form>
    </main>
  </div>
</div>

    <script th:inline="javascript" th:type="javascript">



    </script>
    <script>
      $(".delBtn").click(function(){
          var btn = $(this);
          if(confirm("确定要删除吗？")){
              $("#delForm").attr("action",btn.attr("del_uri")).submit();
          }else{

          }
          return false;
      })
      $("input[type=date]").val(today)
    </script>
<!--<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>-->
      <!--<script>window.jQuery || document.write('<script src="../assets/js/vendor/jquery.slim.min.js"><\/script>')</script><script src="../assets/dist/js/bootstrap.bundle.js"></script>-->
        <script src="https://cdnjs.cloudflare.com/ajax/libs/feather-icons/4.9.0/feather.min.js"></script>
        <!--<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.3/Chart.min.js"></script>-->
        <script th:src="@{/tcr/dashboard.js}"></script></body>
</html>
